Skip to content

Conversation

Copy link

Copilot AI commented Aug 11, 2025

Problem

Syntax errors in definePage() calls would crash the Vite development server, making it impossible to continue development when there were JavaScript syntax issues in the page definition. This created a poor developer experience where a simple typo could bring down the entire dev server.

<script setup>
// This would crash the server
definePage({
  name: 'test',,  // Extra comma - syntax error
  path: '/test'
})
</script>

Solution

Enhanced error handling throughout the definePage processing pipeline to gracefully handle syntax errors and parsing failures:

Key Changes

  1. Added comprehensive try-catch blocks in definePageTransform() and extractDefinePageNameAndPath() functions to catch any parsing or processing errors

  2. Enhanced getCodeAst() function with error handling around Babel AST parsing to prevent syntax errors from propagating

  3. Changed error behavior from throwing SyntaxErrors to logging warnings and returning safe fallback values:

    • When extracting definePage: returns 'export default {}'
    • When removing definePage from source: returns undefined (no transform)
  4. Improved developer feedback by replacing crashes with helpful warning messages that identify the problematic file

Testing

Added comprehensive test coverage for various syntax error scenarios:

  • Extra commas in object literals
  • Missing commas between properties
  • Completely malformed JavaScript
  • Unclosed brackets
  • Invalid scope references

Impact

  • ✅ Vite server no longer crashes on definePage syntax errors
  • ✅ Development can continue with broken definePage calls (they're simply ignored)
  • ✅ Clear warning messages help developers identify and fix issues
  • ✅ Maintains backward compatibility for all valid definePage usage
  • ✅ No performance impact on normal operation

The fix ensures a more robust development experience while maintaining all existing functionality for properly formatted definePage() calls.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

@cloudflare-workers-and-pages
Copy link

cloudflare-workers-and-pages bot commented Aug 11, 2025

Deploying unplugin-vue-router with  Cloudflare Pages  Cloudflare Pages

Latest commit: f41937a
Status: ✅  Deploy successful!
Preview URL: https://0b37225b.unplugin-vue-router.pages.dev
Branch Preview URL: https://copilot-fix-904c72ad-c6f9-42.unplugin-vue-router.pages.dev

View logs

Copilot AI changed the title [WIP] Can you fix this bug? Ideally a syntax error in definePage shouldn't crash the Vite server. I should gracefully handle it by ignoring the object (definePage) entirely Fix: Gracefully handle syntax errors in definePage to prevent Vite server crashes Aug 11, 2025
Copilot AI requested a review from posva August 11, 2025 09:36
Copilot finished work on behalf of posva August 11, 2025 09:36

describe('error handling', () => {
it('handles syntax errors gracefully when extracting definePage', async () => {
const codeWithSyntaxError = `
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this variable for a piece of code can be extracted in the outer scope. Share it among tests

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extracted the codeWithSyntaxError variable to the outer scope of the error handling describe block to share it among the tests, avoiding duplication. (5992675)

expect(result).toBeUndefined()
})

it('handles malformed definePage object gracefully', async () => {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test is redundant, syntax errors are already tested. Ensure you don't have duplicated testss

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed the redundant "handles malformed definePage object gracefully" test as it was duplicating syntax error testing already covered by other tests. (5992675)

expect(result).toBe('export default {}')
})

it('handles completely invalid JavaScript syntax gracefully', async () => {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same here, remove it, it's just syntax error

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed the redundant "handles completely invalid JavaScript syntax gracefully" test as it was just another syntax error variation already covered by existing tests. (5992675)

@posva posva marked this pull request as ready for review August 24, 2025 18:17
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Aug 24, 2025

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.


Comment @coderabbitai help to get the list of available commands and usage tips.

@pkg-pr-new
Copy link

pkg-pr-new bot commented Aug 24, 2025

Open in StackBlitz

npm i https://pkg.pr.new/unplugin-vue-router@692

commit: c623413

@codecov
Copy link

codecov bot commented Aug 24, 2025

Codecov Report

❌ Patch coverage is 77.69784% with 31 lines in your changes missing coverage. Please review.
⚠️ Please upload report for BASE (feat/experimental-router@4e5015e). Learn more about missing BASE report.
⚠️ Report is 64 commits behind head on feat/experimental-router.

Files with missing lines Patch % Lines
src/core/definePage.ts 77.69% 31 Missing ⚠️
Additional details and impacted files
@@                     Coverage Diff                     @@
##             feat/experimental-router     #692   +/-   ##
===========================================================
  Coverage                            ?   61.10%           
===========================================================
  Files                               ?       36           
  Lines                               ?     3409           
  Branches                            ?      626           
===========================================================
  Hits                                ?     2083           
  Misses                              ?     1319           
  Partials                            ?        7           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@posva
Copy link
Owner

posva commented Aug 24, 2025

@copilot address the review

Copilot AI requested a review from posva August 24, 2025 19:08
Copilot finished work on behalf of posva August 24, 2025 19:08
Copy link
Owner

@posva posva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot AI requested a review from posva August 24, 2025 19:33
Copilot finished work on behalf of posva August 24, 2025 19:33
@posva posva changed the base branch from main to feat/experimental-router August 24, 2025 19:35
@posva posva force-pushed the feat/experimental-router branch from dc3f8ef to e5a73fc Compare September 18, 2025 12:15
@posva posva force-pushed the feat/experimental-router branch from e824db5 to 8366aae Compare September 26, 2025 15:32
Base automatically changed from feat/experimental-router to main September 26, 2025 15:35
@posva posva linked an issue Oct 9, 2025 that may be closed by this pull request
@posva posva force-pushed the copilot/fix-904c72ad-c6f9-42ff-858a-83618526f5e2 branch from f41937a to c623413 Compare October 9, 2025 13:43
@posva posva closed this in bc5a060 Oct 9, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

definePage a error object will make vite crash

2 participants